<template>
	<qh-page-view :title="title">
		<view class="wrap">
			<view class="addresslist">
				<view class="form-label">收货姓名</view>
				<view class="form-input">
					<input type="text" placeholder="姓名" placeholder-class="pl" class="name" @input="nameFun" :value="name"></input>
				</view>
			</view>
			<view class="addresslist">
				<view class="form-label">联系电话</view>
				<view class="form-input">
					<input type="number" placeholder="请输入您的电话" placeholder-class="pl" class="call" @input="callFun" maxlength="11" :value="phone"></input>
				</view>
			</view>
			<view class="addresslist">
				<view class="form-label">省市区</view>
				<view class="form-input">
					<province-city-area class="province-city-area" v-model="region" ref="cityRef" keyField="city_name"></province-city-area>
				</view>
			</view>
			<view class="addresslist">
				<view class="form-label">详细地址</view>
				<template v-if="accurate_address_status == 1">
					<view class="form-input input-adress" @tap="getLocal">
						<view v-if="address">{{address}}</view>
						<view v-else class="pl">请选择地址</view>
					</view>
				</template>
				<template v-else>
					<textarea v-model="address" class="address-textarea" placeholder="请输入地址" maxlength="50" placeholder-class="pl"></textarea>
				</template>
				<text @tap="getLocal" class="qh-rt-single qh-rt-weizhi2 choose-position-icon"></text>
				<!-- <view class="choose-position-box">
					<image class="addressimg" src="/static/images/addaddress.png"></image>
				</view> -->
			</view>
			<view class="addresslist">
				<view class="form-label">门牌号</view>
				<view class="form-input">
					<input type="text" placeholder="例1层101室" placeholder-class="pl" class="name" @input="house" :value="house_number"></input>
				</view>
			</view>
			<view class="addresslist" style="justify-content: space-between;padding:30rpx 0 30rpx 20rpx;border-bottom: 0;">
				<view>设置为默认地址</view>
				<!-- #ifdef MP-WEIXIN -->
				<switch color="var(--primary-color)" style="transform: scale(.8);" :checked="default_address == 1" @change="chooseRefuseSet" />
				<!-- #endif -->
				<!-- #ifdef MP-ALIPAY -->
				<switch color="var(--primary-color)" style="transform: scale(.7);" :checked="default_address == 1" @change="chooseRefuseSet" />
				<!-- #endif -->
			</view>
		</view>
		<!-- <view class="form-btn" @tap="getWxAddress">使用微信地址</view> -->
		<view class="form-btn add" @tap="add">{{type == 2 ? '确认保存地址' : '确认添加地址'}}</view>
	</qh-page-view>
</template>

<script>
	var app = getApp().globalData;
	import provinceCityArea from '@/components/province-city-area.vue'
	export default {
		components: {
			provinceCityArea
		},
		data() {
			return {
				title: '',
				name: '',
				item: {
					index: 0,
					msg: '',
					time: ''
				},
				region: ['', '', ''],
				longitude: '',
				latitude: '',
				address: '',
				house_number: "",
				phone: "",
				id: "",
				type: "",
				default_address: 0,
				dataTree: [],
				area: '',
				accurate_address_status: 1, //是否开启精确位置设置
			};
		},
		/**
		 * 生命周期函数--监听页面加载
		 */
		async onLoad(options) {
			this.title = options.type == 2 ? '修改地址' : '添加地址';
			if (options.type == 2) {
				//编辑
				this.type = options.type;
				this.id = options.id;
				let info = uni.getStorageSync('editAdress')
				if (info) {
					this.name = info.name
					this.phone = info.phone
					this.region = [info.province, info.city, info.area]
					this.longitude = info.longitude
					this.latitude = info.latitude
					this.house_number = info.house_number
					this.address = info.origin_address
					this.default_address = info.status
					uni.removeStorageSync('editAdress')
				}
			}
			await this.$onLaunched;
			app.sendRequest({
				url: '/Address/getAddressConf',
				success: (res) => {
					if (res.status == 1) {
						this.accurate_address_status = res.data.accurate_address_status;
					}
				}
			})
		},
		methods: {
			// 设置默认地址
			chooseRefuseSet() {
				this.default_address = this.default_address == 1 ? 0 : 1
			},

			nameFun(e) {
				this.setData({
					name: e.detail.value
				});
			},

			house(e) {
				this.setData({
					house_number: e.detail.value
				});
			},

			callFun(e) {
				this.setData({
					phone: e.detail.value
				});
			},

			// 保存地址
			add() {
				if (!this.name || this.name.trim().length <= 0) {
					uni.showToast({
						title: '姓名不能为空',
						icon: 'none',
						duration: 1500
					});
					return false;
				}

				if (!this.phone || this.phone.trim().length <= 0) {
					uni.showToast({
						title: '电话不能为空',
						icon: 'none',
						duration: 1500
					});
					return false;
				} else if (!/^1[3456789]\d{9}$/.test(this.phone)) {
					uni.showToast({
						title: '手机格式不正确',
						icon:'none',
						duration: 1500
					});
					return true;
				}

				if (this.address == '') {
					uni.showToast({
						title: '地址格式不正确',
						icon:'none',
						duration: 1500
					});
					return true;
				}
				if (!this.region.length) {
					uni.showToast({
						title: '请完善省市区',
						icon:'none',
						duration: 1500
					});
					return true;
				}

				let obj = {
					name: this.name,
					phone: this.phone,
					address: this.address,
					province: this.region[0],
					city: this.region[1],
					area: this.region[2],
					house_number: this.house_number,
					status: this.default_address,
					longitude: this.longitude,
					latitude: this.latitude,
				}
				let url = '/Address/addAddress_v1';
				//编辑
				if (this.type == 2) {
					obj.id = this.id;
					url = '/Address/editAddress_v1';
				}
				app.sendRequest({
					url: url,
					data: obj,
					success: (res) => {
						if (res.status == 1) {
							uni.showModal({
								title: '提示',
								content: res.msg,
								showCancel: false,
								success: (res) => {
									uni.navigateBack();
								}
							});
						} else {
							uni.showToast({
								title: res.msg,
								icon: 'none'
							})
						}
					}
				});
			},
			// 获取选择的位置
			getLocal() {
				uni.chooseLocation({
					success: (res) => {
						console.log(res);
						// #ifdef MP-WEIXIN
						let address = res.address + '';
						//处理直辖市
						let arr = address.split('市');
						if (arr.length > 1) {
							let direct = ['北京', '天津', '上海', '重庆'];
							let index = direct.indexOf(arr[0]);
							if (index >= 0) {
								address = direct[index] + address;
							}
						}

						let allCitys = this.$refs.cityRef.allCitys;
						let index0 = allCitys.findIndex((item) => {
							return address.indexOf(item.city_name) === 0;
						})
						// console.log('index0', index0, allCitys[index0].city_name)
						if (!(index0 >= 0)) return;
						address = address.substr(allCitys[index0].city_name.length);

						let index1 = allCitys[index0].children.findIndex((item) => {
							return address.indexOf(item.city_name) === 0;
						})
						// console.log('index1', index1, address)
						if (!(index1 >= 0)) return;
						address = address.substr(allCitys[index0].children[index1].city_name.length);
						let index2 = allCitys[index0].children[index1].children.findIndex((item) => {
							let name = item.city_name.substring(0, item.city_name.length - 1)
							return address.indexOf(name) === 0;
						})
						// console.log('index2', index2, address)
						if (!(index2 >= 0)) return;
						address = address.substr(allCitys[index0].children[index1].children[index2].city_name.length);

						this.region = [
							allCitys[index0].city_name,
							allCitys[index0].children[index1].city_name,
							allCitys[index0].children[index1].children[index2].city_name
						];
						console.log(this.region)
						this.address = address + res.name;
						this.longitude = res.longitude;
						this.latitude = res.latitude;
						// #endif

						// #ifdef MP-ALIPAY
						this.address = res.address;
						this.longitude = res.longitude;
						this.latitude = res.latitude;
						// #endif
					}
				});
			},
		}
	};
</script>
<style>
	@import "./addAddress.css";
</style>
